<!DOCTYPE HTML>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>无标题文档</title>

	<style type="text/css">
		body{
			font-family: "Microsoft YaHei", 微软雅黑, "Microsoft JhengHei", 华文细黑, STHeiti, MingLiu;
			font-size: 12px;
			margin: 0;
			overflow: hidden;
			
			box-shadow: 2px 2px 3px outset;
			border-radius: 4px;
		}

		.win{
			position: absolute;
			top: 1px;
			left: 1px;
			bottom: 1px;
			right: 1px;
			background-color: white;
			border-radius: 5px;
			border: 1px solid #615B57;
			padding:1px;
		}

		.head{
			position: relative;
			width: 100%;
			height: 20px;
			background: transparent;
			background-color: #F7F4F3;
			border-bottom: 1px solid #615B57;
		}

		.head .name{
			float: left;
			margin-left: 10px;
		}

		.head .close{
			float: right;
			background: url("../images/Btn_Window_Close.png") no-repeat 0px 0px;
			height: 20px;
			width: 20px;

		}

		.head .close:hover{
			background: url("../images/Btn_Window_Close.png") no-repeat -20px 0px;
		}

		.clzz{
			height: 230px;
		}

		.clzz table{
			width:100%; border-left:#C8B9AE solid 1px;border-top:#C8B9AE solid 1px;border-collapse:collapse;
		}

		.clzz td{
			width: 24px;
			height: 24px;
			border-right:#C8B9AE solid 1px;border-bottom:#C8B9AE solid 1px;vertical-align: top;
			background-image: url("../images/qq.gif");
		}

		.clzz td:hover{
			opacity: 0.8;
			-moz-transform: rotate(-30deg);
			-webkit-transform: rotate(-30deg);
			-webkit-filter: sepia(100%);
		}


	</style>
	<script src="../../lib/jquery-1.8.0.min.js"></script>
	<script src="../../lib/artTemlate/template.min.js"></script>
</head>
<body>
	<div class="win">
		<div class="head" id="win_head">
			<div class="name">经典表情</div>
			<div class="close"></div>
		</div>
		<div class="clzz">
			<table width="375px"  border="0" cellspacing="0" cellpadding="0">
				
			</table>
		</div>
		<div class="foot"></div>
	</div>
</body>
	<script type="text/javascript" src="../URLs.js"></script>
	<script type="text/javascript" src="../api.js"></script>
	<script type="text/javascript" src="../parse.js"></script>
	<script type="text/javascript" src="../helper.js"></script>
	<script type="text/javascript" src="../templates.js"></script>
	
	<script type="text/javascript">

var emo = {
	width : 385,
	height : 260,
	timerid : 0,
	uid : 0,
	curid : 0,
	ignore : new Array(),
	opener:0,
	opener_pos:0
};



emo.view = (function(){
	return {
		init : function(){
			$('.close').click(function(){
				AlloyDesktop.close();
			});

			// 处理 窗体拖动事件
			win_head.onmousedown = function() {
				AlloyDesktop.drag();
			};
			win_head.onmouseup = function() {
				AlloyDesktop.stopDrag();
			};

			var emos = $('.clzz table');
			for (var i = 0; i < 9; i++) {
				$(emos).append('<tr></tr>');
			};

			$('.clzz table tr').each(function(){
				for (var i = 0; i < 15; i++) {
					$(this).append('<td></td>');
				};
			});
			$('.clzz table td').each(function(i){
				$(this).css('background-position', (i*24*(-1))+'px 0px');
				$(this).attr('id', i);
				$(this).click(function(){
					AlloyDesktop.execJS('tweet.win.selectEmotion('+parseInt($(this).attr('id'))+','+parseInt(emo.opener_pos)+');',parseInt(emo.opener));
					AlloyDesktop.close();
				});
			});
		}
	};
})();

emo.init = (function(){
	return {
		init : function(){

			 emo.opener = help.alloy.getParam('opener');
			 emo.opener_pos = help.alloy.getParam('epos');
			 console.info(emo.opener_pos);
			 emo.view.init();
			
		},
		readyHandler : function(){
			AlloyDesktop.setTitle("选择表情");
			AlloyDesktop.setWindowStyle("0x00000080L");
			AlloyDesktop.hide();
			var win = AlloyDesktop.getScreenSize();
			var x = help.alloy.getParam('x');
			var y = help.alloy.getParam('y');
			AlloyDesktop.move(parseInt(x),parseInt(y));
			AlloyDesktop.setSize(emo.width,emo.height);
			AlloyDesktop.restore();
			AlloyDesktop.focus();
			//AlloyDesktop.setTopMost();
			
			//AlloyDesktop.enableResize();
			emo.init.init();
		}
	};
})();



addEventListener("AlloyDesktopReady", emo.init.readyHandler);
</script>
</html>